<template>
  <PageContainer>
    <view class="container">
      <Header title="详细浏览记录" />
      <Paglist
        v-if="parame.appUserInfoId"
        v-model="dataList"
        :is-init-api="true"
        :parame="parame"
        @register="register"
        :scroll-top-bottom="260"
        :is-show-loadmore="dataList.length >= 1"
        :isPullDownRefres="false"
      >
        <template v-for="v in dataList" :key="v.id">
          <view class="content">
            <text>{{ dayjs(v.createTime).format('MM-DD HH:mm') }}</text>
            <text v-if="v.shareKey">通过{{ v.inviteUserName }}分享</text>
            <text>进入浏览</text>
          </view>
        </template>
      </Paglist>
    </view>
  </PageContainer>
</template>

<script lang="ts" setup>
  /* activityBrowsingHistoryDetail 详细浏览记录 */
  import { browseDetailList, getActivityRegisterList } from '@/api/activity';
  import Paglist from '@/components/Paglist/index.vue';
  import Header from '@/components/Header/index.vue';
  import PageContainer from '@/components/PageContainer/index.vue';
  import { useConList } from '@/components/Paglist/useConList';
  import { onPageScroll, onPullDownRefresh } from '@dcloudio/uni-app';
  import { provide, ref } from 'vue';
  import { onLoad } from '@/router';
  import type { BrowseDetailList, IBrowseListDetailQuery } from '@/api/activity/types';
  import dayjs from 'dayjs';

  onLoad<'activityBrowsingHistoryDetail'>(async (op) => {
    parame.value.appUserInfoId = op.appUserInfoId;
    parame.value.activityId = op.activityId;
    parame.value.inviteAppUserInfoId = op.inviteAppUserInfoId;
  });
  const [register, { refresh }] = useConList();
  const dataList = ref<BrowseDetailList[]>([]);
  const parame = ref<IBrowseListDetailQuery>({
    activityId: 0,
    appUserInfoId: 0,
    inviteAppUserInfoId: undefined,
    current: 1,
    size: 20,
  });

  provide('api', async (obj: IBrowseListDetailQuery) => {
    const res = await browseDetailList(obj);
    return res;
  });

  onPullDownRefresh(async () => {
    await refresh();
  });
  onPageScroll(() => {});
</script>

<style lang="scss" scoped>
  .container {
    ::v-deep .content {
      display: flex;
      padding: 24rpx 32rpx;
      gap: 24rpx;
      color: #333;
      font-size: 28rpx;
      font-weight: 400;
      line-height: 40rpx;
    }
  }
</style>
